<template>
  <BasicCard>
    <BasicVxeTable v-bind="gridOptions"> </BasicVxeTable>
  </BasicCard>
</template>

<script setup lang="ts">
  import dayjs from 'dayjs'
  import {
    columnsWindingYarn,
    columnsUnloading,
    columnsSingle,
    columnsVision,
    columnsPackage
  } from '../data'
  import { splitTsIdToTime } from '@/utils'
  import { getPackageMachineList } from '@/api/shuJuBaoBiao'

  const props = defineProps({
    type: {
      type: String,
      default: 'windingYarn'
    }
  })
  const { t } = useI18n()
  const start = ref(25072202)
  const end = ref(25072202)

  const pageEnum = {
    windingYarn: [columnsWindingYarn, '络筒上纱', 'shang-sha', 'count'],
    unloadingYarn: [columnsUnloading, '平台卸纱个数', 'xia-sha', 'count'],
    singleYarn: [columnsSingle, '筒纱单纱', 'dan-sha', 'zhongLiang'],
    vision: [columnsVision, '工位视觉', 'shi-jue', 'count'],
    package: [columnsPackage, '包装', 'bao-zhuang', 'zhongLiang']
  }

  const gridOptions = reactive<BasicGridProps>({
    extraConfig: {
      title: t(`custom.${pageEnum[props.type][1]}报表`),
      isCustom: false,
      isExport: false,
      isFilterAndSort: true
    }, // 拓展的配置
    id: `shujubaobiao-luotongshangsha-${props.type}`, // id用于缓存,务必配置
    height: '100%',
    loading: true,
    showFooter: true,
    columns: pageEnum[props.type][0],
    toolbarConfig: {}, // 工具栏
    footerMethod({ columns, data }) {
      return [
        columns.map((column, columnIndex) => {
          if (columnIndex === 0) {
            return '合计'
          } else if (columnIndex === 5) {
            return handleSum(data, pageEnum[props.type][3])
          } else {
            return '--'
          }
        })
      ]
    }
  })

  const handleSum = (data, key) => {
    let count = 0
    data.forEach((item) => {
      count += item[key]
    })
    return '合计:' + count
  }

  const getList = () => {
    getPackageMachineList(
      {
        TsIdStart: start.value,
        TsIdEnd: end.value
      },
      pageEnum[props.type][2]
    )
      .then((res: any) => {
        gridOptions.loading = false
        gridOptions.data = res.map((value) => {
          const temp: any = {}
          if (['windingYarn', 'singleYarn'].includes(props.type)) {
            temp.jiTai = value.jiTai
          } else if (props.type === 'unloadingYarn') {
            temp.jiTai = value.lineNum + '-' + value.jiTai
          }
          return {
            ...value,
            tsid: splitTsIdToTime(value.tsid) + ' ' + value.banCi,
            time: value.time == null ? null : dayjs(value.time).format('YYYY-MM-DD HH:mm:ss'),
            thirdMaterialColorDescription:
              value.materialName == null ? '' : value.thirdMaterialColorDescription,
            ...temp
          }
        })
      })
      .catch(() => {
        gridOptions.loading = false
      })
  }

  onMounted(() => {
    getList()
  })
</script>
